<template>
  <div>
    <van-nav-bar :fixed="true" left-arrow @click-left="onClickLeft" :placeholder="true" title="经销商"></van-nav-bar>
    <!-- 导航栏 -->

    <van-tabs v-model="active" color="#4fa580" title-active-color="#4fa580" line-width="30px">
      <van-tab title="价格最低">
        <div v-for="(item, index) in lowestPrice" :key="index" class="lowest-price">
          <div class="shop-name">
            <div>
              <div class="shop-stores">4S店</div>
              <p>{{item.name}}</p>
            </div>
            <p class="shop-price">{{item.price}}万起</p>
          </div>
          <p>{{item.location}}</p>
          <div>距离{{item.distance}}km 售{{item.direction}}</div>
          <div class="mark-down">
            <div>降价</div>
            <div>获取底价</div>
          </div>
        </div>
      </van-tab>
      <van-tab title="距离最近">
        <div v-for="(item, index) in lowestPrice" :key="index" class="lowest-price">
          <div class="shop-name">
            <div>
              <div class="shop-stores">4S店</div>
              <p>{{item.name}}</p>
            </div>
            <p class="shop-price">{{item.price}}万起</p>
          </div>
          <p>{{item.location}}</p>
          <div>距离{{item.distance}}km 售{{item.direction}}</div>
          <div class="mark-down">
            <div>降价</div>
            <div>获取底价</div>
          </div>
        </div>
      </van-tab>
    </van-tabs>

    <!-- end -->
  </div>
</template>

<script>
export default {
  name: "Dealer",
  data() {
    return {
      active: 0,
      // 假数据
      lowestPrice: [
        {
          name: "申联上汽大众",
          price: "7.01",
          location: "石家庄市建通街28号 (南二环南货场东行50米)",
          distance: "4.00",
          direction: "全国"
        },
        {
          name: "实汇择业上汽大众",
          price: "7.01",
          location:
            "和平西路与古城西路交口北行200米路东/裕华东路与谈固东街西南口",
          distance: "10.00",
          direction: "全国"
        },
        {
          name: "普州众睿上汽大众",
          price: "7.01",
          location: "河北省石家庄市晋州市中心路与东环街交叉口西北角",
          distance: "52.00",
          direction: "本省"
        },
        {
          name: "石家庄众德盛",
          price: "8.19",
          location:
            "河北省石家庄市外环路8号 胜利大街与古城东路交叉口东行500米路南",
          distance: "9.00",
          direction: "全国"
        }
      ]
    };
  },
  methods: {
    onClickLeft() {
      this.$router.go(-1);
    }
  },
    created(){
    let dsBridge = require("dsbridge");
         dsBridge.call("goBack","", function() {
           history.go(-1);
         });
   },
};
</script>

<style>
</style>